<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>组件</title>
    <script src="node_modules/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
    <!--应用组件 -->
    <counter></counter>
</div>
<script type="text/javascript">
    //定义组件
    const counter = {
        template: "<button @click='num++'>您点击了{{num}}次</button>",
        data() {
            return {num: 0}
        }
    };

    //全局注册组件:在所有的vue实例中都可以使用组件
    //Vue.component("counter", counter);

    const app = new Vue({
        el: "#app",
        //局部注册组件
        components: {
            counter: counter
        }
    });
</script>
</body>
</html>